<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>菜单</title>
		<style>
			ul{
				/* 取消纵向排列，实现横向排列 */
				list-style: none;
			}
			li{
				float: left;
				/* 外部空白 */
				margin-right: 10px;
				/* 设置背景色 */
				background-color: cadetblue;
				/* 内部空白，上右下左 */
				padding: 5px 10px 5px 10px;
				border-radius: 5px;
			}
			/* 鼠标操作时间:拖动/移动/单击/双击，鼠标移入，移出后自动还原*/
			li:hover{
				background-color: #FF0000;
			}
			a{
				/* 去除超链接下划线 */
				text-decoration: none;
				color: white;
			}
		</style>
	</head>
	<body>
		<!-- ul标签分组，li条目 -->
		<ul>
			<!-- a标签：链接，href属性：网站地址，target属性：是否弹出新页面 -->
			<li><a href="https://www.w3school.com.cn" target="_blank">W3school</a></li>
			<li><a href="https://www.runoob.com/" target="_blank">菜鸟教程</a></li>
			<li><a href="https://cnblogs.com/" target="_blank">博客园</a></li>
			<li><a href="https://www.csdn.net/" target="_blank">CSDN</a></li>
			<li><a href="https://segmentfault.com/" target="_blank">思否</a></li>
		</ul>
	</body>
</html>
